<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>pure实例</title>
		<!--声明宽度等于设备宽度,禁止缩放-->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!--引入pure.css-->
		<link rel="stylesheet" href="https://unpkg.com/purecss@1.0.0/build/pure-min.css" integrity="sha384-nn4HPE8lTHyVtfCBi5yW9d20FjT8BJwUXyWZT9InLYax14RDjBj46LmSztkmNP9w" crossorigin="anonymous">
		<style type="text/css">
			.pure-u-1-8{
				text-align: center;
			}
		</style>
	</head>
	<body>
		<!--
			官网:https://purecss.io
			1.引入pure.css
			2.meta viewport
			3.使用.pure-g类创建一行，并使用pure-u-*类在该行中创建列。(一行有8列,pure-u-1-8[7,9,10失效])
		-->
		<div class="pure-g">
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		    <div class="pure-u-1-8"><p>Thirds</p></div>
		</div>
	</body>
</html>
